import { PureComponent } from 'react'
import { Modal, Select, Input } from 'antd'
import styles from './storageRackModal.less'
const { Option } = Select
const { TextArea } = Input
class StorageRackModal extends PureComponent {
    handleOk = () => {
        const { onOk } = this.props
        onOk()
    }
    handleCancel = () => {
        const { onCancel } = this.props
        onCancel()
    }
    render(){
        const { visible } = this.props
        return(
            <Modal
            title="货架详情"
            centered
            width={483}
            visible={visible}
            onOk={this.handleOk}
            onCancel={this.handleCancel}
        >
            <div className={styles.storageRackModalContext}>
                <div className={styles.storageRackModalSin}>
                    <span className={styles.storageRackModalSpan}>仓库名称：</span>
                    <Select defaultValue="" className={styles.storageRackModalInput}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="Yiminghe">yiminghe</Option>
                    </Select>
                </div>
                <div className={styles.storageRackModalSin}>
                    <span className={styles.storageRackModalSpan}>货架区域：</span>
                    <Select defaultValue="" className={styles.storageRackModalInput}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="Yiminghe">yiminghe</Option>
                    </Select>
                </div>
                <div className={styles.storageRackModalSin}>
                    <span className={styles.storageRackModalSpan}>始发港：</span>
                    <Select defaultValue="" className={styles.storageRackModalInput}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="Yiminghe">yiminghe</Option>
                    </Select>
                </div>
                <div className={styles.storageRackModalSin}>
                    <span className={styles.storageRackModalSpan}>目的港：</span>
                    <Select defaultValue="" className={styles.storageRackModalInput}>
                            <Option value="jack">Jack</Option>
                            <Option value="lucy">Lucy</Option>
                            <Option value="Yiminghe">yiminghe</Option>
                    </Select>
                </div>
                <div className={styles.storageRackModalSin}>
                    <span className={styles.storageRackModalSpan} >描述：</span>
                    <TextArea rows={4} className={styles.storageRackModalInput}/>
                </div>
            </div>
        </Modal>
        )
    }
}
export default StorageRackModal
